<include file="Forum:header"/>
<body>
<div class="topic-wrap new-article-wrap">
    <header class="talk-header talk-detail-header"><span class="iconfont go-back"></span>
        <p class="text-center">发表话题</p>
    </header>
    <div class="prompt">
        <p class="title">温馨提示：</p>
        <p style="text-indent: 24px;padding-bottom: 10px;">{BEESCRM:$forum['complaintsTips']}</p>
    </div>
    <div class="add-topic">
        <h4 class="title">选择话题类型</h4>
	        <ul class="category-list clearfix" >
	            <volist name="data" id="vo" key="k">
	            <li data-cate_id="{BEESCRM:$vo['category_id']}" class="{BEESCRM:$vo['color']} <if condition="$k eq 1">current</if>">{BEESCRM:$vo['name']}<span class="iconfont"></span></li>
	            </volist>
	        </ul>
        <h4 class="title">上传图片</h4>
        <div class="thumb-preview">
            <form id="upload-form" enctype="multipart/form-data" name="form" onsubmit="return false" class="upload-wrap">
                <div class="icon iconfont" id="addimg"></div>
                <input type="file" id="upload" name="file" id="fileupload_input">
            </form>
        </div>
        <textarea placeholder="输入文字" class="content" id="content"></textarea>
        <div class="emoji-container"><div class="emoji-wrap"><div class="emoji-btn iconfont"  id="express"></div><div class="emoji-list"></div></div></div>
        <input type="hidden" id="img"/>
        <input type="hidden" id="forum_id" value="{BEESCRM:$forum['forum_id']}"/>
        <div class="comment-wrap"><a href="javascript:void(0);" class="comment-btn">发帖</a></div>
    </div>
</div>
<input type="hidden" id="show">
<include file="Forum:commonjs"/>
<script>
    $(function(){
        FastClick.attach(document.body);
        $('.category-list').on('click', 'li', function () {
            $(this).addClass('current').siblings().removeClass('current');
        });
    });
    $('body').click(function(){
    	var show = $('#show').val();
    	if(show){
    		$('.emoji-list').hide();
    		$('#show').val('');
    		$(".emoji-list").html('');
    	}
    });
	// 图片上传
	var imgLength = 0;
	$(document).on('change','#upload', function () {
		var fd = new FormData($('#upload-form')[0]);
		fd.append('file', $('#upload')[0].files[0]);

		if(imgLength >= 5) {
			fm.alert('图片太多了呦~');
			return false;
		}
		$('#upload').val('');
		$.ajax({
			url: '/base/common/upload',
			data: fd,
			processData: false,
			contentType: false,
			type:'POST',
			beforeSend: function () {
				fm.alert("上传中...");
			},
			success: function (res) {
				//$('.loading-wrap').hide();
				var imgResult = $.parseJSON(res);
				if(imgResult.status == 'S') {
					//topicObj.image_list.push(imgResult.url);
					$('.thumb-preview').prepend('<div class="pull-left thumb"><img class="img_add" src="'+ imgResult.url +'"></div>');

					imgLength += 1;
					var img = $('#img').val();
					if(img){
						img += '@' + imgResult.url;
					}else {
						img = imgResult.url;
					}
					$('#img').val(img);
				}else{
					fm.alert('图片上传错误，请重试');
				}
			}/*,
			error:function(){
				fm.alert('通讯错误');
			},*/
		});
	});
	//图片删除
	$(".thumb-preview").on('click','.thumb',function () {
		$(this).remove();
		imgLength -= 1;
	})
	// 提交数据
	$('.comment-btn').click(function(){
		var forum_id = $('#forum_id').val();
		var category_id = $('.category-list').children('.current').data('cate_id');
		var arr=[];
		$('.img_add').each(function(){
			arr.push(this.src);
		});
		var img = arr.join('@');
		var content = $('#content').val();
		if(!content){
			fm.alert('您未输入文字');return false;
		}
		if(!category_id){
			fm.alert('您未选择话题');return false;
		}
		$.ajax({
			type:'post',
			url:"{BEESCRM::U('base/ThumbUp/doGetPost',array('forum_id' => $forum_id))}",
			data:{'forum_id':forum_id,'category_id':category_id,'img':img,'content':content},
			dataType:'json',
			success:function(data){
				if(data.status == 'S'){
					fm.alert(data.message);
					setTimeout(function(){
						location.href = data.url;
					},3000);
				}else {
					fm.alert(data.messge);
				}
			},
			error:function(){
				fm.alert('请刷新重试~');
			}
		});
	});
	$('.go-back').click(function(){
		history.go(-1);
	});
	// 表情
	$('#express').click(function(){
		var show = $('#show').val();
    	$.ajax({
    		type:'post',
    		url:"{BEESCRM::U('base/thumbUp/expression',array('forum_id' => $forum_id))}",
    		data:{},
    		dataType:'json',
    		success:function(data){
    			var html = '';
    			$.each(data.data,function(i,item){
    				html += '<span class="item" data-code="'+item.code+'"><img src="'+item.url+'"></span>';
    			});
    			$(".emoji-list").append(html).addClass('show');
    			$('#show').val(1);
    			if($(".emoji-list").is(":hidden")){
    				$('.emoji-list').show();
    			}
    		},
    		error:function(){
				fm.alert('请刷新后重试~');
    		}
    	});
    });
	$(document).on('click','.item',function(){
    	var content = $('#content').val();
    	
    	$('#content').val(content + $(this).data('code'));
    	$(".emoji-list").removeClass('show');
    });
</script>

</body>
</html>